
<template>
  <div>
    
    <select-area @selectedArea="selectedArea" />
    <van-field v-model="searchAddr" center clearable label="查询地址" placeholder="请输入关键词" >
    </van-field>
    <van-field v-model="searchHospital" center clearable label="医院名称" placeholder="请输入关键词" >
      <van-button slot="button" size="small" type="primary" @click="getLists">查询</van-button>
    </van-field>
    <!--  
    <van-swipe-cell v-for="(i,index) in items" :key="index">
      <van-panel :title="i.Wh_hospital.name" :status="i.Dicts.name">
        <p>
          {{i.Wh_hospital.order_no}},联系电话{{i.Wh_hospital.conn_phone}},{{i.Wh_hospital.addr}}
        </p>
        <div slot="footer">
              <van-button size="mini" @click="onModify(i)">修改</van-button>
        </div>
      </van-panel>
    </van-swipe-cell>-->
    <van-address-list :switchable="false" add-button-text="新增医院"
      v-model="chosenId"
      :list="list"
      default-tag-text="默认"
      @edit="onEdit"
      @add="onAdd"
    />

    <van-dialog v-model="showAdd" title="新增医院" :lazy-render="false" :showConfirmButton="false" show-cancel-button>
        <hospital @onAdded="onAdded" :hospital="hospital"/>
    </van-dialog>
  </div>
</template>

<script>
  import { get } from "@/api/common";
  import SelectArea from "../components/SelectArea";
  import Hospital from "./hospital";
  import { Toast,Dialog } from 'vant';

  export default {
    name: "freestay",
    components: {
      SelectArea,
      Hospital
    },
    data() {
      return {
        checkeds: [],
        searchAddr: '',
        searchHospital: '',
        areaValue: 0,
        list: [],
        chosenId: 0,
        showAdd: false,
        hospital: {id:0,addr:'',name:'',conn_phone:'',order_no:'',area:0,areaName:''},
      }
    },
    mounted() {
      //this.getLists();
    },
    methods: {
      selectedArea(value) {
        this.areaValue = value;
      },
      // 调用api获得当前选择的申请列表
      getLists(){
        let body = {
                  '@column': 'id,order_no,name,area,addr,conn_phone',
                  '@order': 'order_no+',
                  };
        if(this.areaValue>0)
          body['area'] = this.areaValue;
        if(this.searchAddr!='')
          body['addr$'] = '%'+this.searchAddr+'%';
        if(this.searchHospital!='')
          body['name$'] = '%'+this.searchHospital+'%';
        let params = {'[]': {
                'Wh_hospital': body,
                'Dicts':{
                  '@column': 'value,name',
                  'value@': '/Wh_hospital/area',
                  'object': 'wh_hotel',
                  'field': 'checkin_area'
                }
              }
            };
        get(params)
          .then( res=> {
            var data = res.data["[]"];
            this.list = [];
            for(var d in data) {
              var h = data[d].Wh_hospital;
              var d = data[d].Dicts;
              h['tel'] = h.conn_phone;
              h['address'] = h.addr+'-'+d.name;
              h['areaName'] = d.name;
              this.list.push(h);
            }
          })
          .catch(function (error){
              console.log(error);
          });
      },
      onAdd() {
        this.hospital = {id:0,addr:'',name:'',conn_phone:'',order_no:'',area:0,areaName:''};
        this.showAdd = true;
      },
      onAdded(value) {
        this.showAdd = false;
      },
      onEdit(item, index) {
        this.showAdd = true;
        this.hospital = item;
        console.info(this.hospital);
      }
    }
  }
</script>

<style scoped>
p{
  padding-left:10px;
}
</style>
  